import React, { Component } from 'react';
import '../assets/styles/logins.css'
import { Layout, Menu } from 'antd';
import Nest from '../router/Nest'
import Suib from './Header/Index';
import My from './Header/My';
const { Header, Content, Footer, Sider } = Layout;


class Index extends Component {

  render() {
    const openKey = this.props.location.pathname.split('/').slice(0, 3).join('/')
    const selectedKey = this.props.location.pathname
    const getItem = (item, withNav = false) => {
      return withNav
        ? {
          key: item.key,
          label: item.label,
          // 新版菜单具备导航功能的写法
          onClick: () => {
            // 编程式导航

            this.props.history.push(item.key)
          },
        }
        : {
          key: item.key,
          label: item.label,
        }
    }


    const items = [
      { key: '/dashboard/welcome/index', label: '首页' },
      { key: '/dashboard/detailpage', label: '详情', children: [{ key: "/dashboard/detailpage/index", label: '详情页' }] },
      { key: '/dashboard/controlpage', label: '控制', children: [{ key: "/dashboard/controlpage/index", label: '控制页' }] },
      { key: '/dashboard/operationlog', label: '操作', children: [{ key: "/dashboard/operationlog/index", label: '操作日志' }] },
      { key: '/dashboard/dataanalysis', label: '数据', children: [{ key: "/dashboard/dataanalysis/index", label: '数据分析' }, { key: "/dashboard/dataanalysis/tongji", label: '数据统计' }] },

    ];
    let navs = []
    items &&
      items.forEach((item) => {
        let nav
        if (item.children && item.children.length > 0) {
          nav = getItem(item)
          nav.children = []
          // 具备二级菜单，子菜单的处理
          item.children.forEach((el) => {
            // 判断是否为菜单，是则保存
            nav.children.push(getItem(el, true))
          })
        } else {
          nav = getItem(item, true)
        }
        navs.push(nav)
      })

    return (
      <Layout>

        <Sider trigger={null} collapsible id='jj'>
          <div className="logo" >

          </div>
          <span className='logozi'>
            <My style={{
              textAlign: 'center', width: '200px',
              display: 'block'
            }} />
          </span>


          <Menu
            theme="dark"
            mode="inline"
            // 默认展开
            defaultOpenKeys={[openKey]}
            // 默认选中
            defaultSelectedKeys={[selectedKey]}

            items={navs}
          />
        </Sider>
        <Layout>
          <Header
            className="site-layout-sub-header-background"
            style={{
              padding: 0,
            }}
          >
            <Suib />
          </Header>

          <Content
            style={{
              border: '20px solid #E9F0F8'
            }}
          >
            <div
              className="site-layout-background"
              style={{
                backgroundColor: '#E9F0F8',
                minHeight: 360,
              }}
            >
              <Nest />
            </div>
          </Content>
        </Layout>
      </Layout>
    );
  }
  componentDidMount() {


    if (!localStorage.getItem('jwt')) {
      this.props.history.push('/login')

    }
  }




}

export default Index;
